import { useState, useEffect } from 'react'

export function useWindowResize() {
  const [clientRectangle, setClientRectangle] = useState({ width: 0, height: 0 })
  const handleResize = () => {
    window.addEventListener('resize', () => {
      const newRect = { width: document.documentElement.clientWidth, height: document.documentElement.clientHeight }
      setClientRectangle(newRect)
    })
  }

  useEffect(() => {
    window.addEventListener('resize', handleResize)
    return () => {
      window.removeEventListener('resize', handleResize)
    }
  }, [])

  return clientRectangle
}
